<template>
  <button @click="doClick" class="button" :class="[typeDeal,size,round?'is-rounded':'',loading?'is-loading':'']">
    <slot>按钮</slot>
  </button>
</template>

<script>
export default {
  props: {
    type: {
      type: String,
      default: ""
    },
    size: {
      type: String,
      default: ""
    },
    round: {
      type: Boolean,
      default: false
    },
    loading: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    typeDeal() {
      let rType;
      switch (this.type) {
        case "success":
        case "primary":
        case "danger":
        case "warning":
        case "info":
        case "link":
          rType = "is-" + this.type;
          break;
        default:
          rType = "";
      }
      return rType;
    }
  },
  methods: {
    doClick() {
      if (this.$listeners.click) {
        this.$emit("click"); //原生事件绑定到组件可以使用native修饰符
      }
    }
  }
};
</script>

<style>
</style>
